@import './mixin';

@include hide-scrollbar('.x-scroll-inner'); // ←即使我们隐藏了自定义的scrollbar,但是元素原生的滚动条在移动端仍然会存在(即使我们已经将scrollbar部分移动到scroll根元素区域外隐藏了,emmm... 它仍然会跳出来)
.x-scroll {
  position:relative;
  overflow:hidden;

  &-inner {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    overflow: auto;
  }
  &-scrollbar{
    width:10px;
    position:absolute;
    right:0;
    top:0;
    height:100%;
    &-track {
      &-thumb {
        position: absolute;
        top: 0;
        left: 2px;
        width: 6px;
        border-radius: 3px;
        background: rgba(128, 128, 128, .8);
      }
    }
    &-button {

    }
  }

  &-pulling{
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
    &-text{
      font-size:12px;
    }
    &-icon{
      font-size:30px;
    }
  }
}
